<template>
  <div class="my-personality">
    <div class="deposit-content">
        <div class="top-bg">
            <van-nav-bar class="header" fixed :border="false" @click-left="diffBack">
                <div class="left"
                    slot="left">
                    <van-icon name="arrow-left"
                            size="24px"
                            color="#fff" />
                </div>
                <div class="title"
                    slot="title">{{title}}</div>
            </van-nav-bar>
        </div>
        <div  class="reset-wrapper">
            <van-cell-group label-align="left"
                class="portraitGroup">
            <van-cell
                    title="头像"
                    is-link
                    center
                    class="cellImg"
                    @click="gomodifyHeadImg">
                    <div>
                        <img v-if="!pictureUrl" src="@/assets/img/designer/personalCenter/defaultHeadPortrait.png">
                        <img v-else :src="pictureUrl">
                    </div>
                    </van-cell>
            </van-cell-group>
            <van-cell-group label-align="left"
                class="portraitGroup">
                <van-cell title="姓名"
                        is-link
                        center
                        class="cell"
                        @click="goEditName"
                        >{{name?name: "待完善"}}</van-cell>
            </van-cell-group>
            <van-cell-group label-align="left"
                class="portraitGroup">
            <van-cell title="性别"
                    is-link
                    center
                    class="cell"
                    @click="goEditSex">
                    <div>
                        <span>{{sex ==""?"待完善": sex=="男"?"男":"女"}}</span>
                    </div>
                    </van-cell>
            </van-cell-group>
            <van-cell-group class="portraitGroupB" label-align="left">
                <van-cell title="修改密码"
                        class="cell"
                        center
                        is-link
                        @click="goCorrect"></van-cell>
            </van-cell-group>
            <van-cell-group label-align="center">
                <div class="exitBtn"
                    @click="ExitLogin">退出登录</div>
            </van-cell-group>
        </div>
    </div>
  </div>
</template>
<script>
import {
  removeRole,
  removeToken,
  removeuserUid,
  getUserInfo,
  getVersionNo
} from "@/utils/auth.js";
import {setRemind} from '@/utils/chat.js'
export default {
  components: {},
  data() {
    return {
      title: "我的资料",
      name: "",
      pictureUrl: "",
      sex: ""
    };
  },
  created() {
    let name  = getUserInfo().userName
    let pictureUrl = getUserInfo().pictureUrl
    let sex = getUserInfo().sex
    let version = getVersionNo()
    if (!name) {
      this.$toast('参数异常')
        window.setTimeout(() => {
          this.$router.push('/designer/personalCenter')
        }, 500)
      return
    }
    this.name = name
    this.pictureUrl = pictureUrl
    this.sex = sex
    this.version = version
  },
  mounted() {
  },
  methods: {
    diffBack () {
        this.$router.push('/designer/personalCenter')
    },
    gomodifyHeadImg() {
        this.$router.push('/designer/modifyHeadImg')
    },
    // 编辑名字
    goEditName() {
        const self = this
        self.$router.push({
            name: 'designer-personalEditing',
            params: {
                tages: "isName",
                info: self.name
            }
        })
    },
    // 编辑性别
    goEditSex() {
        const self = this
        self.$router.push({
            name: 'designer-personalEditing',
            params: {
                tages: "isSex",
                info: self.sex
            }
        })
    },
    // 忘记密码
    goCorrect() {
      this.$router.push({name: 'forgetPwd', params: {fromW: 'originPwd'}});
    },
    ExitLogin() {
			this.$imconn.close(); //退出环信，此时浏览器报错属正常现象请无视
			this.$store.commit("setHot", false);
			this.$store.commit("setSystemHot", false);
			this.$store.commit("serverHot", false);
			this.$store.commit("setScroll", 0);
            setRemind('');
			window.localStorage.setItem("unread", JSON.stringify(''));
      removeToken();
      removeuserUid();
      removeRole();
      this.$store.commit('setTabIndex',0)
      setTimeout(this.$router.push({ name: "login" }), 2000);
    }
  }
};
</script>
<style lang="scss" scoped>
.my-personality {
  .top-bg{
        width: 100%;
        background: #fff;
        border-bottom-left-radius: 0.5rem;
        border-bottom-right-radius: 0.5rem;
        .header {
            background: #5E8EFE;
            color: #ffffff;
            height: 0.92rem;
            .title {
                color: #ffffff;
                font-size: 0.35rem;
                }
        }
  }
  .reset-wrapper{
      position: fixed;
      width: 100%;
      padding: 0.24rem;
      box-sizing: border-box;
      top: 0.92rem;
      left: 0;
      right: 0;
      overflow-y: scroll;
      bottom: 1.6rem;
  }
  .portraitGroup {
    border-radius: 0.1rem;
    margin-bottom: 0.24rem;
    .weui-cells .vux-no-group-title {
      margin-top: 0px;
    }
  }
  .portraitGroupB {
    border-radius: 0.1rem;
    margin-bottom: 0.5rem;
    .weui-cells .vux-no-group-title {
      margin-top: 0px;
    }
  }
  .cell {
    min-height: 1rem;
    font-family: PingFang-SC-Medium;
    font-weight: 500;
    color: #3f3e3e;
    font-size: 0.3rem;
  }
  .cellImg{
    height: 1.68rem;
    font-family: PingFang-SC-Medium;
    font-weight: 500;
    color: #3f3e3e;
    font-size: 0.3rem;
    img {
      border-radius: 50%;
      width: 1.28rem;
      height:1.28rem;
      margin-top: 0.13rem;
    }
  }
  .exitBtn {
    height: 0.9rem;
    width: 100%;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    color: #fff;
    font-size: 0.26rem;
    text-align: center;
    line-height: 0.9rem;
    margin: 0 auto;
    background: #5E8EFE;
    border-radius: 0.1rem;
  }
}
</style>
